<template>
  <div class="shopCart">
    <van-nav-bar title="购物车" />
    <div class="nav">
      <div v-for='(item,index) in shopList'>
        <van-swipe-cell :right-width="65">
          <van-checkbox v-model="checked"></van-checkbox>
          <van-card
            :num="item.num"
            :tag="item.tag"
            :price="item.price"
            :desc="item.desc"
            :title="item.name"
            :thumb="item.img"
            :origin-price="item.oldPrice">
            <div slot="footer">
              <van-button size="mini">-</van-button>
              <span class="pl-10 pr-10">{{item.num}}</span>
              <van-button size="mini">+</van-button>
            </div>
          </van-card>
          <span slot="right">删除</span>
        </van-swipe-cell>
      </div>
    </div>

      <div class="p-42">
        <van-submit-bar
          :price="3050"
          button-text="去结算"
          @submit="onSubmit"
        >
          <van-checkbox v-model="checked">全选</van-checkbox>
          <span slot="tip">
            你的收货地址不支持同城送, <span>修改地址</span>
          </span>
        </van-submit-bar>
      </div>
      <mt-footer></mt-footer>
  </div>
</template>

<script>
export default {
  data(){
    return{
      shopList:[
        // {num:2,tag:'标签',price:9.00,desc:'描述信息描述信息',name:'商品名称',img:require('../../../public/images/shop.png'),oldPrice:10.00},
        // {num:3,tag:'标签',price:9.00,desc:'描述信息',name:'商品名称',img:require('../../../public/images/shop.png'),oldPrice:10.00},
        // {num:4,tag:'标签',price:9.00,desc:'描述信息',name:'商品名称',img:require('../../../public/images/shop.png'),oldPrice:10.00},
        // {num:5,tag:'标签',price:9.00,desc:'描述信息',name:'商品名称',img:require('../../../public/images/shop.png'),oldPrice:10.00},
        // {num:2,tag:'标签',price:9.00,desc:'描述信息描述信息',name:'商品名称',img:require('../../../public/images/shop.png'),oldPrice:10.00},
        // {num:3,tag:'标签',price:9.00,desc:'描述信息',name:'商品名称',img:require('../../../public/images/shop.png'),oldPrice:10.00},
        // {num:4,tag:'标签',price:9.00,desc:'描述信息',name:'商品名称',img:require('../../../public/images/shop.png'),oldPrice:10.00},
        // {num:5,tag:'标签',price:9.00,desc:'描述信息',name:'商品名称',img:require('../../../public/images/shop.png'),oldPrice:10.00}
      ],
      checked:false
    }
  },
  created(){

  },
  methods:{
    onSubmit(){

    }
  },
  computed:{

  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
  .nav{padding-bottom: 130px;}
  .nav>div{display: flex;}

</style>
